<template>
  <div>
    <el-select placeholder="请选择" v-model="brandId" filterable clearable  v-loading="loading" :disabled="loading">
      <el-option
        v-for="item in brands"
        :key="item.brandId"
        :label="item.brandName"
        :value="item.brandId"
      ></el-option>
    </el-select>
  </div>
</template>

<script>

import { brandsList } from '@/api/goods/category-brand-relation'

export default {
  components: {},
  props: {
    // catPath: {
    //   type: Number,
    //   default(){
    //     return 0;
    //   }
    // }
    catPath: {
      type: String,
      default(){
        return '';
      }
    }
  },
  data() {
    //这里存放数据
    return {
      catId: '',
      brands: [
        {
          label: "a",
          value: 1
        }
      ],
      brandId: "",
      subscribe: null,
      loading: false,
    };
  },
  computed: {},
  watch: {
    brandId(val) {
      this.$emit("brandId",val)
    },
    catPath(val){
      this.brandId = ''
      this.catId = val
      this.getCatBrands()
    },
  },
  methods: {
    getCatBrands() {
      this.loading = true
      brandsList({ catId: this.catId })
        .then((data) => {
          this.brands = data.data;
          this.loading = false
        }).catch(()=>{})
    }
  },
  mounted() {
    //监听三级分类消息的变化
    // this.subscribe = PubSub.subscribe("catPath", (msg, val) => {
    //   this.catId = val[val.length - 1];
    //   this.getCatBrands();
    // });
  },
  beforeDestroy() {
    //PubSub.unsubscribe(this.subscribe); //销毁订阅
  },
}
</script>
